<div class="alain-default__header">
  <div class="alain-default__header-logo">
    <a [routerLink]="['/dev']" class="alain-default__header-logo-link">
      <img class="alain-default__header-logo-expanded" src="./assets/img/logo-full.svg" alt="{{settings.app.name}}" style="max-height:40px;"
      />
      <img class="alain-default__header-logo-collapsed" src="./assets/img/logo.svg" alt="{{settings.app.name}}" style="max-height:30px;"
      />
    </a>
  </div>
  <div class="alain-default__nav-wrap">
    <ul class="alain-default__nav">
      <li>
        <div class="alain-default__nav-item" (click)="toggleCollapsedSideabar()">
          <i nz-icon nzType="menu-{{settings.layout.collapsed ? 'unfold' : 'fold'}}"></i>
        </div>
      </li>
      <li>
        <div class="alain-default__nav-item" (click)="toggleLang()">
          {{ lang }}
        </div>
      </li>
    </ul>
  </div>
</div>
<div class="alain-default__aside">
  <div class="alain-default__aside-inner">
    <div nz-dropdown nzTrigger="click" [nzDropdownMenu]="userMenu" class="alain-default__aside-user">
      <nz-avatar class="alain-default__aside-user-avatar" [nzSize]="'large'" nzIcon="anticon anticon-user"></nz-avatar>
      <div class="alain-default__aside-user-info">
        <strong>{{settings.user.name}}</strong>
        <p class="text-truncate mb0">{{settings.user.email}}</p>
      </div>
    </div>
    <nz-dropdown-menu #userMenu="nzDropdownMenu">
      <ul nz-menu>
        <li nz-menu-item (click)="msgSrv.success('profile')">{{ 'profile' | translate }}</li>
        <li nz-menu-item (click)="msgSrv.success('settings')">{{ 'settings' | translate }}</li>
        <li nz-menu-item (click)="msgSrv.success('logout')">{{ 'logout' | translate }}</li>
      </ul>
    </nz-dropdown-menu>
    <sidebar-nav class="d-block py-lg"></sidebar-nav>
  </div>
</div>
<section class="alain-default__content">
  <reuse-tab [mode]="2" [customContextMenu]="customContextMenu"></reuse-tab>
  <router-outlet></router-outlet>
</section>
